<html>
<head>
	<meta name='layout' content='main_admin_login'/>
	<title><g:message code="springSecurity.login.title"/></title>
</head>

<body>

	<!--------------------------------->
	<!-- Now, the page itself begins -->
	<!--------------------------------->
	
	<!-- The toolbar at the top -->
	<section id="toolbar">
		<div class="container_12">
		


			
			<!-- Phone only items -->
			<div class="phone">
				
				<!-- User Link -->
				<li><a href="#"><span class="icon icon-home"></span></a></li>
				<!-- Navigation -->
				<li><a href="#"><span class="icon icon-heart"></span></a></li>
			
			</div><!-- End of .phone -->
			
		</div><!-- End of .container_12 -->
	</section><!-- End of #toolbar -->
	
	<!-- The header containing the logo -->
	<header class="container_12">
		
		<div class="container">
		
			<!-- Your logos -->
			<a href="/tf-mango/"><img src="${resource(dir: 'img', file: 'logo-light.png')}" alt="Mango" width="210" height="67"></a>
			<a class="phone-title" href="login.html"><img src="${resource(dir: 'img', file: 'logo-mobile.png')}" alt="Mango" height="22" width="70" /></a>
			

			
		</div><!-- End of .container -->
	
	</header><!-- End of header -->
	
	<!-- The container of the sidebar and content box -->
	<section id="login" class="container_12 clearfix">
	
		<form action="${postUrl}" method="post" class="box validate" id='loginForm' autocomplete='off'>
		
			<div class="header">
				<h2><span class="icon icon-lock"></span>Login</h2>
			</div>
			
			<div class="content">
				
				<!-- Login messages -->
				<div class="login-messages">
					
					<g:if test='${flash.message}'>
						<div class='message failure' style="display: block;">${flash.message}</div>
					</g:if>
					<g:else>
						<div class="message welcome">Welcome back!</div>
						<div class="message failure">Invalid credentials.</div>
					</g:else>
					
				</div>
			
				<!-- The form -->
				<div class="form-box">
				
					<div class="row">
						<label for="login_name">
							<strong>Username</strong>
							<small>Or email address</small>
						</label>
						<div>
							<input tabindex=1 type="text" class="required noerror" name=j_username id=username />
						</div>
					</div>
					
					<div class="row">
						<label for="login_pw">
							<strong>Password</strong>
							<small><a href="javascript:void(0);" id="">Forgot it?</a></small>
						</label>
						<div>
							<input tabindex=2 type="password" class="required noerror" name=j_password id=password />
						</div>
					</div>
					
				</div><!-- End of .form-box -->
				
			</div><!-- End of .content -->
			
			<div class="actions">
				<div class="left">
					<div class="rememberme">
						<input tabindex=4 type="checkbox" name="${rememberMeParameter}" id="remember_me"  <g:if test='${hasCookie}'>checked</g:if>/><label for="remember_me">Remember me?</label>
					</div>
				</div>
				<div class="right">
					<input tabindex=3 type="submit" value="Sign In" name="submit" id="submit"/>
				</div>
			</div><!-- End of .actions -->
			
		</form><!-- End of form -->

	</section>
	
</body>
</html>
